<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" th:href="@{/}+'layuiadmin/style/admin.css'" media="all">
<link rel="stylesheet" href="js/zTree/css/zTreeStyle/zTreeStyle.css" media="all">
<script type="text/javascript" src="js/zTree/js/jquery.ztree.all.min.js"></script>
<script th:src="@{/}+'js/day.js'"></script>
<style type="text/css">
.layui-inline{
	width:136px!important
}
</style>
</head>
<body>
<div class="layui-fluid">
  <div class="layui-card">  
    <div class="layui-card-body">
    <div class="layui-row layui-col-space20">
    <div class="layui-col-md6">
    <div class="layui-row layui-col-space2 layui-form">
    
      <div class="layui-inline">
         <input type="text" id="name" placeholder="角色名称" autocomplete="off" class="layui-input">
      </div>
      <div class="layui-inline">
         <select name="orgId" id="orgId" lay-filter='orgId'></select>
      </div>
     <div class="layui-btn-group">
	    <button type="button" class="layui-btn layui-btn-primary" id="queryBtn" data-type="queryBtn">查询</button>
	    <button type="button" class="layui-btn" data-type="add">增加</button>
	    <button type="button" class="layui-btn" data-type="edit">修改</button>
	    <button type="button" class="layui-btn" data-type="batchDel">删除</button>
  	</div>
  <div class="layui-row">
  <table id="post-table" lay-filter="post-table"></table>
  </div>
  </div>
  </div>
  <div class="layui-col-md6">
  	<div class="layui-row layui-col-space2">
     <div class="layui-btn-group">
	    <button type="button" class="layui-btn" data-type="assign">保存菜单权限</button>
	  </div>
	  <div class="layui-row">
	  <ul id="treeDemo" class="ztree"></ul>
	  </div>
  </div>
  </div>
  
    </div>
  </div>
</div>
</div>
<script th:inline="none">

layui.use(['table','form'], function(){
  var form = layui.form,
  upload = layui.upload
  ,table = layui.table;
  table.render({
	    elem: '#post-table'
	    ,url: 'role/getPageList?v='+new Date().getTime()
	    ,cols: [[
	      {type: 'checkbox', fixed: 'left'}
	      ,{field: 'id', title: 'ID',hide:true}
	      ,{field: 'name', width: 300, title: '名称',edit:true}
	      ,{field: 'code', width: 170, title: '编码',edit:true}
	      ,{field: 'orderno', width: 90, title: '排序',edit:true}
	      ,{field: 'orgName', width: 150, title: '所属公司'}
	    ]]
	    ,page: true
	    ,limit: 30
	    ,height: (top.height-90)+'px'
	    ,text: '加载错误'
		,done:function(){
			enableRowClick(table,form,'post-table',"post-table",'selectPost');
		  }
	});
  select("org/getList?orgType=head" , "orgId",form,"name","id",'',"--选择公司--");
	window.selectPost = function(){
		treeObj.reAsyncChildNodes(null, "refresh");
		table.reload("btn-table",{where:{naviId:"#"}})
	}
	table.on("edit(post-table)",function(obj){
		 axios.put("role/save",obj.data).then(res=>{
			 if(res.data.code==1){
				 layer.msg(res.data.msg)
			 }
		 });
	  })
    var treeSetting = {
			async: {
				enable: true,
				url: "navi/getFullNaviTree",
				autoParam:["id=pid"]
			},
			check:{
				enable:true
			},
			view:{
				showTitle: true,
				selectedMulti : false
			},callback:{
				onAsyncSuccess: function(){
					var checkStatus = table.checkStatus('post-table')
			         ,checkData = checkStatus.data; 
					var roleId = "";
			    	 if(checkData.length == 1){
						roleId = checkData[0].id;
			         }
			    	 $.ajax({
				    	url:"role/getRoleNaviList",
				    	type:'POST',
				    	dataType:'json',
				    	data:{roleId: roleId},
				    	success:function(ret){
				    		let data = ret.data;
				    		for(var i=0;i<data.length;i++){
				    			var nodes =  treeObj.getNodesByParam("id",data[i].naviId,null);
				    			if(nodes.length==1){
				    				treeObj.checkNode(nodes[0],true,false);
				    			}
				    		}
				    			  
				    	}
				    })
					
				},
				onClick:function(){
					var nodes =  treeObj.getSelectedNodes();
					table.reload("btn-table",{where:{naviId:nodes[0].id}})
				}
				
	 	}
  };
  $.fn.zTree.init($("#treeDemo"), treeSetting);
  window.treeObj = $.fn.zTree.getZTreeObj("treeDemo");
  window.loadGrid = function(id){
	  
	  var checkStatus = "";
	  if(typeof(id)=="undefined"){
		  checkStatus = table.checkStatus('post-table');
	      checkData = checkStatus.data; 
	  }else{
		  checkData = id;
	  }
	  table.reload('post-table');
	  selectedRows(checkData,table,form,'post-table','post-table');
  }
  var action = {
	queryBtn: function(){
		 var whr = {name:$('#name').val(),orgId:$("#orgId").val()};	 
		 table.reload("post-table",{where:whr}) 
	},
	batchDel: function(){
      var checkStatus = table.checkStatus('post-table')
      ,checkData = checkStatus.data; 
      
      if(checkData.length === 0){
        return layer.msg('请选择要删除的记录');
      }
      var ids = [];
	  for(let i=0;i<checkData.length;i++){
		  ids[i] = checkData[i].id;
	  }
      layer.confirm('确定删除吗？', function(index) {
    	  $.ajax({
    		  url:"role/delete",
    		  type:'POST',
    		  dataType:'json',
    		  data:{ids: ids},
    		  success:function(ret){
    			  table.reload('post-table');
    	          layer.msg('删除成功');
    		  }
    	  })
          
        })
    }
    ,add: function(){
    	layer.open({
    		type: 2,
    		title:'增加角色',
    		area:['500px','500px'],
    		content: 'rooter?url=system/role/add-role',
    		btn:['保存','关闭'],
    		yes:function(index,layero){
    			var dataForm = layer.getChildFrame('form', index);
    			dataForm.find("#submitBtn").click();
    			return false
    		}
    	})    
    },edit: function(){
    	var checkStatus = table.checkStatus('post-table')
        ,checkData = checkStatus.data; 
        
        if(checkData.length === 0){
          return layer.msg('请选择要修改的记录');
        }
        layer.open({
    		type: 2,
    		title:'修改角色',
    		area:['500px','500px'],
    		content: 'rooter?url=system/role/add-role&naviid='+naviid+'&id='+checkData[0].id+'&v='+new Date().getTime(),
    		btn:['保存','关闭'],
    		yes:function(index,layero){
    			
    			var dataForm = layer.getChildFrame('form', index);
    			dataForm.find("#submitBtn").click();
    			return false
    		}
    	})    
    },assign: function(){
    	var checkStatus = table.checkStatus('post-table')
        ,checkData = checkStatus.data; 
   	 	if(checkData.length == 0){
   	 		return layer.msg("请选择角色",{icon:0});
        }
    	var btn = $(this).attr("disabled",true).addClass("layui-btn-disabled");
    	var naviIds = [];
    	var nodes = treeObj.getCheckedNodes(true);
    	for(let i=0;i<nodes.length;i++){
    		naviIds[i] = nodes[i].id;
    	}
    	$.ajax({
			url:'role/assignNavis',
			data: {naviIds: naviIds,roleCode: checkData[0].code},
			type:'POST',
			dataType:'json',
			success:function(ret){
				
				treeObj.reAsyncChildNodes(null, "refresh");
				btn.attr("disabled",false).removeClass("layui-btn-disabled");
			}
		})    
    }
  };
  $('.layui-btn[data-type]').each(function(i,obj){
	  $(this).on('click', function(){
		   var type = $(this).data('type');
		   action[type].call(this);
	  })
  });
});
</script>
</body>